코어자바스크립트 스터디를 시작하며 포스팅을 시작한다. 1장은 데이터 타입에 대해 다루고 있다. 1장에서는 메모리 상에서 자바스크립트의 변수나 객체의 값이 어떻게 할당되고 변경되는지에 대해 자세히 다룬다. 이번 포스팅에서는 1장의 핵심적인 내용이라 여겨지는 내용을 다루려 한다.

1. 변수의 선언과 데이터 할당

---

let a = "abc"

다음과 같이 변수를 선언하면, 컴퓨터는 비어있는 메모리 공간을 확보한다. 위의 코드는 __변수 영역__과 __데이터 영역__으로 나뉘어 두 공간의 메모리에 저장된다.

변수영역

: 위의 코드를 예시로 들자면 변수의 식별자이자 이름인 a가 할당되는 영역이다. 그리고 식별자 외에 해당 변수에 할당될 데이터 값이 저장된 메모리의 주소를 저장한다. 즉, 변수영역은 데이터를 저장하지 않고 참조한다.

데이터영역

: 위의 코드를 예시로 들자면 'abc'라는 데이터가 저장되는 메모리 영역이다. 해당 영역은 변수영역에 의해 참조된다.

2. 불변성

---

불변성이란 한번 데이터 영역에 할당된 데이터는 변경될 수 없음을 의미한다.

let a = "안녕";
a = a + "하세요";

console.log(a); // 안녕하세요

해당 코드에서 변수의 값이 변경되었다. 그러나 데이터영역에 저장된 값이 실제로 바뀌지 않는다. '안녕하세요'라는 새로운 문자열이 메모리에 저장되고, 변수영역에서 참조하는 주소값이 해당영역으로 바뀐 것이다.

한편 기존의 '안녕'이라는 데이터를 참조하는 변수가 더이상 존재하지 않는다면, 해당 데이터는 가비지 컬렉팅을 당한다.

이처럼 데이터영역에 한번 할당된 값은 불변성을 지닌다. 자바스크립트의 기본형 데이터들은 이러한 불변성을 지니기에 불변값이라 한다.

3. 참조형 데이터(객체)

---

참조형 데이터는 기본형 데이터와 달리, 별도로 __객체의 변수 영역__을 따로 할당 받는다. 이는 객체의 프로퍼티 식별자와 저장될 데이터 주소를 참조하는 메모리 영역이다.

그리고 코드로 내부 프로퍼티 값을 변경한다면, 객체 변수 영역에서 변경된 데이터가 저장된 새로운 메모리영역을 참조하게 된다. 이 과정에서 객체 변수 영역의 데이터에 변화가 발생한다.

이처럼, __객체 변수 영역__이 참조하는 데이터의 주소값이 변경되기 때문에 참조형데이터를 가변적이라 한다. 그러나 이는 언제나 객체의 프로퍼티 값을 변경할 때만 해당되는 이야기다.

한편, 어떠한 데이터를 쓰든 메모리 내의 데이터 영역이 불변성을 지닌다는 것은 바뀌지 않는다.

4. 불변객체

---

객체의 내부 프로퍼티를 변경할 때, 객체를 복사하여 원본 객체의 불변성을 유지하고 변경 사항을 복사객체에 적용하는 방식으로 구현된다.

• 얕은 복사 : 참조형 데이터의 프로퍼티가 모두 기본형일 때, 바로 아래 단계의 값만 복사하는 방법. 만약 중첩객체와 같이 프로퍼티가 참조형 데이터일 경우 이러한 얕은 복사만으로 불변객체를 만들 수 없다.

• 깊은 복사 : 참조형 데이터의 내부 프로퍼티가 참조형 데이터일 경우, 아래 단계의 값의 복사를 재귀적으로 실행하여 모든 객체 프로퍼티를 복사해내는 방법.

5. undefined와 null

---

undefined와 null 모두 '없음'을 의미한다.

• undefined : 사용자가 명시적으로 지정할 수 있지만 지양된다. : 변수에 값이 없을 때 자바스크립트 엔진에 의하여 자동으로 undefined값이 할당된다. : 배열의 요소에 undefined를 할당하면 해당 요소는 순회대상에서 제외된다.

• null : 변수가 '비어있음'을 나타내기 위해 존재하는 값. : 변수가 '비어있음'을 표현하고 싶다면 undefined가 아닌 null을 쓰도록 한다.